<extend name="Base:base" />
<block name="title">
<title>蔬菜外卖 - 添加食品</title>
</block>
<block name="main-content">
<section class="wrapper">
	<!-- BASIC FORM ELELEMNTS -->
	<div class="row mt">
		<div class="col-lg-12">
			<div class="form-panel">
				<h4 class="mb">
					<i class="fa fa-angle-right"></i> 添加食品
				</h4>
				<form class="form-horizontal style-form" method="get">
					<div class="form-group">
						<label class="col-sm-1 col-sm-1 control-label">食品名称：</label>
						<div class="col-sm-3">
							<input type="text" id="name" name="name" class="form-control">
						</div>
						<div class="col-sm-2"></div>
						<label class="col-sm-1 col-sm-1 control-label">食品类型：</label>
						<div class="col-sm-3">
							<select id="type" name="type" class="form-control"
								onchange="selectTag();">
								<option value="1">蔬菜</option>
								<option value="2">水果</option>
								<option value="3">肉类</option>
								<option value="4">海鲜</option>
								<option value="5">熟食</option>
							</select>
						</div>
						<div class="col-sm-2"></div>
					</div>
					<div class="form-group" style="position: relative;">
						<label class="col-sm-1 col-sm-1 control-label">食品样图：</label>
						<div class="col-sm-3">
							<input type='text' class="form-control" name='textfield'
								id='textfield' class='txt' />
						</div>
						<div class="col-sm-1">
							<input type='button' class='btn' value='浏览' /> <input
								style="opacity: 0;" type="file" name="fileField" class="file"
								id="fileField" size="28"
								onchange="document.getElementById('textfield').value=this.value" />
						</div>
						<div class="col-sm-1"></div>
						<label class="col-sm-1 col-sm-1 control-label">食品标签：</label>
						<div class="col-sm-3">
							<select id="tag" name="tag" class="form-control">
							</select>
						</div>
						<div class="col-sm-2"></div>
					</div>
					<div id="other" class="form-group">
						<label class="col-sm-1 col-sm-1 control-label">食品单价：</label>
						<div class="col-sm-3">
							<input class="form-control" type="text" name="price" id="price">
						</div>
						<div class="col-sm-2"></div>
						<label class="col-sm-1 col-sm-1 control-label">食品单位：</label>
						<div class="col-sm-3">
							<select id="unit" name="unit" onchange="addUnit();"
								class="form-control">
								<foreach name="unit" item="u">
								<option value="{$u['name']}">{$u.name}</option>
								</foreach>
								<option value="a">自定义单位</option>
							</select>
						</div>
						<div class="col-sm-2"></div>
					</div>

					<div class="form-group">
						<label class="col-sm-1 col-sm-1 control-label">食品原价：</label>
						<div class="col-sm-3">
							<input class="form-control" type="text" name="yprice" id="yprice">
						</div>
						<div class="col-sm-2"></div>
					</div>

					<div class="form-group">
						<label class="col-sm-1 col-sm-1 control-label">食品简介：</label>
						<div class="col-sm-11">
							<textarea style="height: 100px;" id="introduce" name="introduce"
								class="form-control"></textarea>
						</div>
					</div>
					<div style="text-align: center;">
						<button id="save" style="width: 70px; margin-right: 50px;"
							type="button" class="btn  btn-success">添加</button>

						<button style="width: 70px;" type="reset" class="btn btn-default">取消</button>
					</div>
				</form>
			</div>
		</div>
	</div>
</section>
<!-- 添加单位弹出框 -->
<div class="modal fade" id="myAddUnitModal" tabindex="-1" role="dialog"
	aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="myModalLabel">新增食品单位</h4>
			</div>
			<div class="modal-body">
				<div style="text-align: center;">
					<label class="col-sm-3 col-sm-3 control-label"
						style="padding-left: 60px; padding-top: 5px;">食品单位：</label> <input
						id="newUnit" name="newUnit" type="text" />
				</div>
				<div id="addcontent"></div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
					<button type="button" class="btn btn-danger">确定</button>
				</div>
			</div>
		</div>
	</div>


	</section>


</block>
<block name="js-content">
	<script src="__PUBLIC__/assets/js/jquery-ui-1.9.2.custom.min.js"></script>
	<script src="__PUBLIC__/assets/js/bootstrap-switch.js"></script>
	<script src="__PUBLIC__/assets/js/jquery.tagsinput.js"></script>


	<script type="text/javascript">
  var addFood = "{:U('Food/addFood')}";
  var addUniturl = "{:U('Food/addUnit')}";
  var getTagurl  = "{:U('Food/getFoodTag')}";
  function addUnit(){
	  var unit = $("#unit").val();
	  	if(unit=="a"){
	  		$("#myAddUnitModal").modal('show');
	  	}	
  }
  function selectTag(){
    var type = $("#type").val();
      $("#tag").html("");
    $.post(getTagurl,{type:type},
        function(data){
          for(var j=0;j<data.length;j++){
            var str="<option value="+data[j]['tag_name']+">"+data[j]['tag_name']+"</option>";
             $("#tag").append(str);
          }
        });
  }
  $(function(){
	    var type = $("#type").val();
	    $.post(getTagurl,{type:type},
	        function(data){
	          for(var j=0;j<data.length;j++){
	            var str="<option value="+data[j]['tag_name']+">"+data[j]['tag_name']+"</option>";
	             $("#tag").append(str);
	          }
	        });
	  	$("#save").click(function(){
	  		var name=$("#name").val();
	  		var tag=$("#tag").val();
	  		var unit=$("#unit").val();
	  		var introduce=$("#introduce").val();
	  		var price=$("#price").val();
	      var yprice=$("#yprice").val();
	        var type = $("#type").val();
	 		  $.ajaxFileUpload
				(
	           {
	               url: addFood, //用于文件上传的服务器端请求地址
	               type: 'post',
	               data: {name:name,tag:tag,unit:unit,introduce:introduce,price:price,type:type}, //此参数非常严谨，写错一个引号都不行
	               secureuri: false, //一般设置为false
	               fileElementId: 'fileField', //文件上传空间的id属性  <input type="file" id="file" name="file" />
	               dataType: 'json', //返回值类型 一般设置为json
	               success: function (data, status)  //服务器成功响应处理函数
	               {
	            	   if(data.status==1){
	                       alert("添加成功！");
	                       window.location.reload();
	            	   }else{
	            		   alert("添加失败！");
	                       window.location.reload();
	            	   }

	               },
	               error: function (data, status, e)//服务器响应失败处理函数
	               {
	                   alert("添加失败！");
	                   window.location.reload();
	               }
	           }
	       ) 		  
	  	});
	 })
  //添加食品单位操作.
  	$('#myAddUnitModal').on('click', 'button.btn-danger', function (a) {
			  var newUnit=$("#newUnit").val();
				 $.post(addUniturl,{newUnit:newUnit},
					function(data){
						if(data.status=='1'){
							$("#addcontent").html("<font color='green'>添加成功！</font>");
							setTimeout(function(){window.location.reload();},1000);
					   }else{
						  $("#addcontent").html("<font color='red'>添加失败 </font>");
						}	
					},
					'json'
				);
		});
  </script>
</block>